<template>
  <div style="padding:10px;">
    <!-- search start -->
    <el-input v-model="paramsStr.search"
              type="text"
              placeholder="请输入..."
              style="width:25%;"></el-input>
    <el-select v-model="paramsStr.city_id"
               style="margin:0 2%;"
               placeholder="请选择省">
      <el-option v-for="(item, index) of provinceList"
                 :label="item.name"
                 :value="item.id"
                 :key="index"></el-option>
    </el-select>
    <el-select v-model="paramsStr.type"
               placeholder="是否独立设置"
               style="margin-right:2%;">
      <el-option label="已设置"
                 value="1"></el-option>
      <el-option label="未设置"
                 value="2"></el-option>
    </el-select>
    <el-button type="primary"
               @click="init">搜索</el-button>
    <!-- search end -->

    <!-- table start-->
    <table-data-el :tableData="tableData.list"
                   :tableLabel="tableLabel"
                   :page.sync="paramsStr.page"
                   :pageSize.sync="paramsStr.pageSize"
                   style="margin-top:20px;"
                   v-loading="loading"
                   height="81vh"
                   :pageCount="tableData.rows" />
    <!-- table end-->
  </div>
</template>

<script>
import tableDataEl from '@/views/Setup/common/table'
export default {
  name: "popularizeList",
  data () {
    return {
      paramsStr: {
        page: 1,
        pageSize: 8,
        search: ''
      },
      provinceList: [],
      tableData: [],
      tableLabel: [
        {
          label: '直推奖励',
          prop: ''
        },
        {
          label: '间推奖励',
          prop: ''
        },
        {
          label: '设置人',
          prop: ''
        },
        {
          label: '设置时间',
          prop: ''
        },
        {
          label: '操作',
          prop: ''
        }
      ],
      loading: false
    }
  },
  components: {
    tableDataEl
  },
  methods: {
    async getProvinceList () {
      let res = await this.api.province()
      this.provinceList = res.data;
    },
    async init () {
      this.loading = true;
      let res = await this.api.alonePopularziMoney(this.paramsStr)
      this.tableData = res.data;
      this.loading = false;
    }
  },
  mounted () {
    this.getProvinceList();
    this.init();
  }
}
</script>

<style scoped>
</style>
